<template>
	<view class="member-details">
		<view class="details-body">
			
			<view class="body-item">
				<view class="body-title">
					<text>头像</text>
				</view>
				<view class="body-data">
					<view class="data-potitle">
						<image src="../../static/icon/start.png"></image>
					</view>
					<view class="body-icon">
						<image src="../../static/icon/deepArrow.png" mode=""></image>
					</view>
				</view>
			</view>

			<view class="body-item">
				<view class="body-title">
					<text>名字</text>
				</view>
				<view class="body-data">
					<view class="data-title">
						<text>eager</text>
					</view>
					<view class="body-icon">
						<image src="../../static/icon/deepArrow.png" mode=""></image>
					</view>
				</view>
			</view>

			<view class="body-item">
				<view class="body-title">
					<text>ID</text>
				</view>
				<view class="body-data">
					<view class="data-title">
						<text>462734356</text>
					</view>
					<view class="body-icon">
						<image src="../../static/icon/deepArrow.png" mode=""></image>
					</view>
				</view>
			</view>

			<view class="body-item">
				<view class="body-title">
					<text>性别</text>
				</view>
				<view class="body-data">
					<view class="data-title">
						<text>男</text>
					</view>
					<view class="body-icon">
						<image src="../../static/icon/deepArrow.png" mode=""></image>
					</view>
				</view>
			</view>

			<view class="body-item" id="yhl">
				<view class="body-title">
					<text>个性签名</text>
				</view>
				<view class="body-data">
					<view class="data-title">
						<text>革命还未完成,同志仍需努力!</text>
					</view>
					<view class="body-icon">
						<image src="../../static/icon/deepArrow.png" mode=""></image>
					</view>
				</view>
			</view>

			<view class="body-item">
				<view class="body-title">
					<text>我的地址</text>
				</view>
				<view class="body-data">
					<view class="body-icon">
						<image src="../../static/icon/deepArrow.png" mode=""></image>
					</view>
				</view>
			</view>

		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {

			}
		},
		methods: {
			
		}
	}
</script>

<style scoped lang="scss">
	.member-details {
		height: 100vh;
		background: #ededed;

		.details-body {
			border-bottom: 1rpx solid #fafafa;

			.body-item {
				padding: 35rpx;
				background-color: #ffffff;
				display: flex;
				align-items: center;
				justify-content: space-between;
				border-bottom: 1px solid #e9e9e9;

				.body-data {
					display: flex;
					align-items: center;
					justify-content: space-between;

					.data-potitle {
						width: 50px;
						height: 56px;
						border-radius: 20%;
						overflow: hidden;
						margin-right: 10rpx;

						image {
							width: 100%;
							height: 100%;
						}
					}

					.body-icon image {
						width: 35rpx;
						height: 35rpx;
						position: relative;
						top: 6rpx;
					}

					.data-title {
						color: #8e8e8e;
						padding-right: 10rpx;
					}
				}
			}
			.body-item:active {
				background-color: #e5e5e5;
			}

			#yhl {
				margin: 15rpx 0;
			}
		}
	}
</style>
